import 'package:flutter/material.dart';
import 'package:ref/ref.dart';
import 'state.dart';

class TestClass extends StatelessWidget {
  const TestClass({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        Text('-----测试自定义类-----'),
        Wrap(
          children: [
            MvvmDemo01(),
            MvvmDemo02(),
          ],
        )
      ],
    );
  }
}

// -------------------------------------------------------------------------------------------------------
class MvvmDemo01 extends StatefulWidget {
  const MvvmDemo01({Key? key}) : super(key: key);
  @override
  _MvvmDemo01State createState() => _MvvmDemo01State();
}

class _MvvmDemo01State extends State<MvvmDemo01> {
  add() {
    userInfo.set(() {
      userInfo.value.info.name = 'hello world';
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      width: MediaQuery.of(context).size.width / 2,
      color: Colors.black.withOpacity(0.1),
      padding: EdgeInsets.all(5),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          RefBuilder(
            () => Text(
              userInfo.value.info.name,
              style: TextStyle(fontSize: 20),
            ),
          ),
          TextButton(onPressed: add, child: Text('修改姓名')),
        ],
      ),
    );
  }
}

// ---------------------------------------------------------------------------------------------------
class MvvmDemo02 extends StatefulWidget {
  const MvvmDemo02({Key? key}) : super(key: key);
  @override
  _MvvmDemo02State createState() => _MvvmDemo02State();
}

class _MvvmDemo02State extends State<MvvmDemo02> {
  add() {
    userInfo.value.info.name = 'nice to meet you';
    userInfo.value = userInfo;
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      width: MediaQuery.of(context).size.width / 2,
      color: Colors.black.withOpacity(0.2),
      padding: EdgeInsets.all(5),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          RefBuilder(
            () => Text(
              userInfo.value.info.name,
              style: TextStyle(fontSize: 20),
            ),
          ),
          TextButton(onPressed: add, child: Text('修改姓名')),
        ],
      ),
    );
  }
}
